<template>
  <div style="width: 100%; height: 100%;">
    <dv-scroll-board :config="config"/>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { getCityData } from "../apis/home";
// const props = defineProps(['config'])
const config = ref()
const data = ref([]);
const getCityData1 = () => {
  getCityData().then((res) => {
    let array = res.data;
    array.forEach((item) => {
      let arr = [];
      arr[0] = item.twh;
      arr[1] = item.ypmc;
      arr[2] = item.jcxm;
      arr[3] = `<span style="color:#1AED83;">${item.jcjg}</span>`;
      arr[4] = item.date;
      data.value.push(arr);
    });
    config.value = {
      header: ["摊位号", "商品名称", "检测项目", "检测结果", "检测时间"],
      headerBGC: "none",
      oddRowBGC: "#17325B",
      evenRowBGC: "#0C1B48",
      columnWidth: ["110"],
      rowNum:6,
      data: data.value,
      align: ["center", "center", "center", "center", "center"],
    };
  });
};
getCityData1()
</script>

<style scoped lang="scss">
.home-container .content .item-box .item .dv-scroll-board .header .header-item {
  color: #0fffff;
  font-size: 14px;
}
:deep(.dv-scroll-board .rows .row-item){
  font-size: 16px !important;
}
.dv-scroll-board {
  width: 100% !important;
  height: 100% !important;
}
</style>
